<template>
  <div class="app-container">

    <div>
      <el-form :inline="true" :model="searchData" class="demo-form-inline">
        <el-form-item label="表名称">
          <el-input v-model="searchData.tableName" placeholder=""></el-input>
        </el-form-item>

        <el-form-item label="表描述">
          <el-input v-model="searchData.tableComment" placeholder=""></el-input>
        </el-form-item>

        <el-form-item label="选择日期">
          <el-date-picker
            v-model="searchData.date"
            type="daterange" value-format="yyyy-MM-dd"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期">
          </el-date-picker>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="onSearch">查询</el-button>
        </el-form-item>
      </el-form>
    </div>

    <el-table :data="tableData" :border="true" size="medium" style="width: 100%">
      <el-table-column prop="tableName" label="表名称" width="300"></el-table-column>
      <el-table-column prop="tableComment" label="表描述" width="300"></el-table-column>
      <el-table-column prop="createTime" label="创建时间" ></el-table-column>
      <el-table-column prop="updateTime" label="更新时间" ></el-table-column>
      <el-table-column
        label="操作"
        align="center"
        width="180"
        class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            type="primary"
            round
            @click="genCode(scope.row)"
            v-hasPermi="['tool:gen:code']"
            >生成代码</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="i-page">
      <el-pagination
        :page-size="pagesize"
        :current-page="pagenum"
        layout="prev, pager, next"
        :total="total"
        @current-change="currentchange"></el-pagination>
    </div>
  </div>

</template>

<script>
  import { listGen } from "@/api/system/gen";
  import { genCode } from "@/api/system/gen";

  export default {
    data() {
      return {
        searchData: {
          tableName: '',
          tableComment: '',
          date: []
        },
        tableData: [],

        pagenum: 1,
        pagesize: 10,
        total: 0
      }
    },
    created(){
      this.getList();
    },
    methods: {
      getData() {
        //ajax
      },
      getList() {
        //页面进来先查询list
        this.loading = true;
        let starttime, enttime;
        if (this.searchData.date.length > 0) {
          starttime = this.searchData.date[0];
          enttime = this.searchData.date[1];
        }
        listGen({
          tableName: this.searchData.tableName,
          tableComment: this.searchData.tableComment,
          starttime: starttime,
          enttime: enttime,
          pageSize: this.pagesize,
          pageNum: this.pagenum
        }).then(res => {
          this.tableData = res.rows;
          this.total = res.total;
        })

      },
      onSearch() {
        this.pagenum = 1;
        this.getList();
      },
      currentchange(val) {
        this.pagenum = val;
        this.getList();
      },
      genCode(row) {
        this.$confirm('确定要生成"' + row.tableName + '"表代码吗?', "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return genCode(row.tableName);
        }).then(() => {
          this.getList();
          this.msgSuccess("生成成功");
        }).catch(function() {});
      }
    }
  }
</script>
<style lang="scss">
  .i-page {
    text-align: right;
    margin-top: 20px;
  }
</style>
